<template>
  <MrCustom bg-color="bg-gradual-blue " is-back>
    <template #backText>
      返回
    </template>
  </MrCustom>
  <view v-if="inquiryInfo" class="bg-white">
    <InquiryItem :inquiry-item="inquiryInfo"></InquiryItem>
  </view>
  <view class="bg-white margin-bottom-lg">
    <view class="cu-bar">
      <view class="text-black text-xxl padding-lr-sm">
        全部解答
      </view>
    </view>
    <z-paging ref="pagingRef" @query="queryList" v-model="list" use-page-scroll>
      <CommentList :list="list" can-reply></CommentList>
    </z-paging>
  </view>
  <view class="cu-bar foot input ">
    <view class="action">
      <text class="cuIcon-write text-gray"></text>
    </view>

    <input class="solid-bottom"
           confirm-type="send"
           @confirm="addCommentRoot"
           placeholder="写解答" v-model="content"
           maxlength="300" cursor-spacing="10"/>

    <view class="action">
      <text class="cuIcon-comment text-black"></text>
    </view>
  </view>
</template>

<script setup lang="ts">

import {ref} from "vue";
import {onLoad} from "@dcloudio/uni-app";
import InquiryItem from "@/components/common/item/InquiryItem.vue";
import CommentList from "@/components/common/list/CommentList.vue";
import api from "@/api";
import {useUserStore} from "@/store";
import MrCustom from "@/components/common/MrCustom.vue";


const userStore= useUserStore()
const inquiryInfo = ref()
const pagingRef=ref()
const list =ref()
const content =ref()
onLoad((option) => {
  inquiryInfo.value = JSON.parse(decodeURIComponent(option.inquiryInfo))
})

/**
 * 评论
 */
const queryList = (pageNo: any, pageSize: any) => {
  api.comment.commentList({
    targetId: inquiryInfo.value.id,
    targetType: 5,
    pageNo: pageNo,
    pageSize: pageSize
  }).then(res => {
    if (res && res.data.code === 0) {
      let tmp = res.data.data.records
      pagingRef.value.complete(tmp);
    }
  })
}

const addCommentRoot = () => {
  console.log(content.value)
  api.comment.createCommentRoot({
    targetId: inquiryInfo.value.id,
    targetType: 5,
    fromUsername: userStore.userInfo.username,
    fromAvatar: userStore.userInfo.avatar,
    fromName: ' ',
    toUsername: inquiryInfo.value.username,
    content: content.value
  }).then(res => {
    if (res && res.data.code === 0) {
      uni.showToast({
        title: res.data.msg,
        icon: 'success',
        success: () => {
          pagingRef.value.reload()
          content.value = ''
        }
      })
    }
  })
}
</script>

<style scoped>

</style>